<template>
<div>
    <div>
        <a-tabs default-active-key="1" @change="tabs_change">
            <a-tab-pane key="1" tab="编辑POIS（这是后续对于地名地址的本地化更新的拓展 因为国家的地名是2014年的 较旧）">
                <a-form :form="form" :label-col="{ span: 2 }" :wrapper-col="{ span: 22 }" >
                    <a-form-item label="新闻类型：">
                        <a-select v-model="news.type" style="width: 220px" @change="Change_select">
                            <a-select-option value="政策信息">政策信息</a-select-option>
                            <a-select-option value="工作动态">工作动态</a-select-option>
                            <a-select-option value="基层信息">基层信息</a-select-option>
                        </a-select>
                    </a-form-item>
                </a-form>
                <el-table :data="news_list"  stripe border size="mini"   
                    :highlight-current-row='true' 
                    empty-text="没有新闻内容" 
                    @row-dblclick="dbclickRow"
                    >
                    <el-table-column prop="title" type="text" label="新闻标题" width="370px" align="center"  :show-overflow-tooltip='true'></el-table-column>
                    <el-table-column prop="time" type="text" label="新闻时间" width="140px" align="center"  :formatter="format_time"></el-table-column>
                    <el-table-column type="text" label="包含图片" width="90px" align="center"  :formatter="haspic"></el-table-column>
                    <el-table-column type="text" label="是否滚动" width="90px" align="center"  :formatter="iswaper"></el-table-column>
                    <el-table-column align="right" width="120px" >
                        <template slot="header" >
                            <a-button type="dashed" @click="search_content(currentPage)">查询</a-button>
                        </template>
                        <template slot-scope="scope">
                            <i aria-label="图标: star" class="anticon anticon-star" v-show="scope.row.havepic" style="margin-right: 10px;cursor: pointer;" :title="scope.row.swiper?'取消滚动':'设置滚动'" @click="setswaper(scope.row)">
                                <svg viewBox="64 64 896 896" data-icon="star" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="" :style="scope.row.swiper?'color: #5085fd;':''"> 
                                    <path d="M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 0 0 .6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0 0 46.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3z"></path>
                                </svg>
                            </i>
                            <a-button type="dashed" @click="delete_content(scope)">
                                <a-icon type="delete"  />
                            </a-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div class="m-manager-table__pagination" >
                    <a-pagination 
                    :default-current="1" 
                    :current="currentPage"
                    :total="totalItems" 
                    :show-total="showtotal"
                    :showLessItems="true"
                    size="small"
                    @change="change_page_number"
                    />
                </div>
            </a-tab-pane>
        </a-tabs>
        <edit_swaper></edit_swaper>
    </div>
</div>

</template>
<script>
import Bus from '../../../src/bus.js';
import $ from 'jquery';
export default {
    data() {
        return {

            news_list:[],
            totalItems:0,
            currentPage:1,

            form:this.$form.createForm(this, { name: 'news' }),
            news_list:[],
            news:{
                type:'工作动态',
            },
        } 
    },
    components: {
      edit_swaper: () => import("@/components/platform/edit/edit_swaper.vue"), 
    },
    mounted() {
        Bus.$on('refresh_edit_news', () => {
            this.search_content(this.currentPage);
        })
        this.search_content(1);
    },
    methods:{
        showtotal(total, range){
            return `共 ${this.totalItems} 个，当前${range[0]}-${range[1]}`
        },
        change_page_number(page, pageSize){
            this.currentPage=page
            this.search_content(page);
        },
        search_content(page){
            let that=this;
            let ajaxSet={
                type:"post",
                async:true,
                dataType:"json",
                url:window.Glod.ajax+'xzqh/search_news?',
                data:{
                    type:this.news.type,
                    pageSize:10,
                    pageNum:page,
                }
            }
            $.ajax(ajaxSet)
            .then(databack=>{
                 if(databack.status==true){
                    that.news_list=databack.result.data;
                    that.totalItems=databack.result.pageInfo.total;
                }
                else{
                    that.$message.error('查询新闻失败');
                }
            },error=>{
                    that.$message.error('查询新闻失败');
                }
            );
        },
        format_time(row, column, cellValue, index){
            return new Date(row.time).format("yyyy-MM-dd hh:mm:ss")
        },
        haspic(row, column, cellValue, index){
            return row.havepic?'是':'否'
        },
        iswaper(row, column, cellValue, index){
            return row.swiper?'是':'否'
        },
        setswaper(row){
            let swiper=!row.swiper
            if(swiper==true){
                Bus.$emit('set_swaper',row._id,swiper);
            }
            else{
                let that=this;
                let ajaxSet={
                    type:"post",
                    async:true,
                    dataType:"json",
                    url:window.Glod.ajax+"xzqh/update_news_swiper?",
                    data:{
                        swiper:'false',
                        id:row._id,
                    }
                }
                $.ajax(ajaxSet)
                .then(databack=>{
                    if(databack.status==true){
                        that.search_content(that.currentPage);
                    }
                });
            }
            

            
        },
        Change_select(value){
            this.search_content(1);
        },
        
        delete_content(scope){
            this.$message.info('暂时不支持删除新闻操作');
        },
        dbclickRow(row, column, cell, event){
            console.log(row, column, cell, event)
            this.$router.push({
                path: `/platform/newsList/notic/detail/${row._id}`,
            })

        },
    }
  }
</script>